<template>

  <view-box ref="viewBox">
    <group class="content patrol-detail-content">

      <cell-box>
        <div>
          巡检地点：嘉兴佳通加气站
          <br>
          巡检人：王文
          <br>
          巡检时间：2017-09-09 班次：白班
        </div>

      </cell-box>

      <cell-box class="lng-flex lng-jc-sb">
        <div>储罐</div>
        <div class="tag red-tag">异常</div>
      </cell-box>

      <div class="content-detail">
        异常情况说明：滑道间隙过小或变形、以及润滑油牌号不当、油压低和流量过小、缺油造成十字头和滑道磨损过快或烧研。
        <div class="img-auto">
          <img src="../../assets/img/protal.png" alt="">
        </div>
      </div>

      <cell-box class="lng-flex lng-jc-sb">
        <div>加气枪</div>
        <div class="tag green-tag">正常</div>
      </cell-box>

      <cell-box class="lng-flex lng-jc-sb">
        <div>工艺管路</div>
        <div class="tag green-tag">正常</div>
      </cell-box>
      <cell-box class="lng-flex lng-jc-sb">
        <div>各类仪表</div>
        <div class="tag green-tag">正常</div>
      </cell-box>
      <cell-box class="lng-flex lng-jc-sb">
        <div>消防器材</div>
        <div class="tag green-tag">正常</div>
      </cell-box>
      <cell-box class="lng-flex lng-jc-sb">
        <div>报警系统</div>
        <div class="tag green-tag">正常</div>
      </cell-box>
      <cell-box class="lng-flex lng-jc-sb">
        <div>设备操作</div>
        <div class="tag green-tag">正常</div>
      </cell-box>
      <cell-box class="lng-flex lng-jc-sb">
        <div>周边环境</div>
        <div class="tag green-tag">正常</div>
      </cell-box>

    </group>

  </view-box>


</template>

<script>
  import {
    ViewBox,
    Flexbox,
    Group,
    CellBox,
    XInput,
    FlexboxItem,
    PopupPicker,
    Popup,
    Cell,
    TransferDom,
    XDialog
  } from 'vux'


  export default {
    directives: {
      TransferDom
    },
    components: {
      ViewBox,
      Cell,
      Group,
      CellBox,
      Popup,
      PopupPicker,
      Flexbox,
      FlexboxItem,
    },
    mounted() {

    },
    data () {
      return {
        showDetailDialog: false,
        name: "",
        showSearchBox: true,
        area: [],
        station: [],
        stationList: [[
          {
            name: '嘉通站',
            value: 'jiatong',
          },
          {
            name: '嘉的萨满的萨克的萨克的撒接口的站',
            value: 'jiadtong',
          },
        ]],
        showPopup: false,
        years: []
      }
    },
    methods: {
      getDetail(){
        this.showDetailDialog = true;
      },
      change(){
        this.$router.push({
          name: 'equipmentChange',
          query: {id: 11}
        })
      },
      toggleSearchBox(){
        this.showSearchBox = !this.showSearchBox;
      },
      search(){
        this.showSearchBox = false;
      },
      goPath(name){
        this.$router.push({
          name: name
        });
      },
      onChange (val) {
        console.log('val change', val)
      },
      onShow () {
        console.log('on show')
      },
      onHide (type) {
        console.log('on hide', type)
      }
    }
  }
</script>

<style scoped>
  .content-detail {
    padding: 10px 15px;
  }

</style>

<style>

  .patrol-detail-content .weui-cells {
    margin-top: 0;
  }
</style>
